<include file="../header" />
<div class="wrapper">
    <div class="header text-center font-16">
        日常巡检
        <div class="iconfont icon-zuo go_index"></div>
    </div>
    <div class="history-list">
        <div class="addimg clearfix" id="repair_image">
            <!--<div class="load-img">
                <div class="img">
                    <img src="/assets/repaireast/images/touxiang.png">
                </div>
                <div class="img">
                    <div class="load text-center">
                        +
                    </div>
                </div>
            </div>
            <input type="file" class="file hide">-->
            <div class="thumb-preview load-img">
                <form id="upload-form" enctype="multipart/form-data" name="form" onsubmit="return false" class="upload-wrap img">
                    <div class="iconfont icon-plus-copy load" id="addimg"></div>
                    <!--<input type="file" id="upload" class="upload-btn" name="file">-->
                    <a href="javascript:;" id="upload" class="upload-btn"></a>
                </form>
            </div>
            <input type="hidden" id="img"/>
        </div>
        <div class="repair-list describe-content">
            <input type="text" id="content" placeholder="请描述巡检情况">
        </div>
        <div class="repair-list clearfix">
            <p class="pull-left">
                巡查区域：{BEESCRM:$patrol['patrol_area']}   巡查对象：{BEESCRM:$patrol['patrol_object']}   巡查内容：{BEESCRM:$patrol['equipment']}
            </p>
        </div>
    </div>
    <input type="hidden" id="serverId" value="">
    <a href="#" class="btn public-btn text-center" id="patrol_submit">提交</a>

    <div class="pop-box hide">
        <input type="hidden" id="address_id">
        <div class="pop-hint">
            <div class="delete">
                <img src="/assets/repaireast/images/delete.png" alt="">
            </div>
            <div class="txt text-center">真的要删除？</div>
            <div class="text-center pop-btn flex">
                <a href="#" class="no">取消</a>
                <a href="#" class="yes btn-visit">确定</a>
            </div>
            <div class="iconfont icon-cheng1"></div>
        </div>
    </div>
</div>
<include file="../getphotos"/>
<script src="/assets/repaireast/js/layer.js"></script>
<script src="/assets/repaireast/js/public.js"></script>
<!--<script type="text/javascript" src="/assets/bower_components/upload/jquery.ui.widget.js"></script>-->
<!--<script type="text/javascript" src="/assets/bower_components/upload/jquery.fileupload.js"></script>-->
<script type="text/javascript" src="/assets/bower_components/upload/jquery.iframe-transport.js"></script>
<script>
    var imgLength = 0,img_id = 0,serverArr = [];
    $('.upload-btn').click(function(){
        if(imgLength >= 5) {
            fm.alert('图片太多了呦~');
            return false;
        }else{
            wx.ready(function(){
                wx.chooseImage({
                    count: 1, // 默认9
                    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
                    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
                    success: function (res) {
                        var localIds = res.localIds;
                        // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                        // localId 可以用于微信手机版图片显示（目前PC版不可用）
                        $('.thumb-preview').prepend('<div class="pull-left thumb img img-'+ img_id +'" data-id=""><img class="img_add" src="'+ localIds[0] +'"></div>');
                        imgLength ++;

                        var localId = localIds.pop();
                        wx.uploadImage({
                            localId: localId, // 需要上传的图片的本地ID，由chooseImage接口获得
                            isShowProgressTips: 1, // 默认为1，显示进度提示
                            success: function (res) {
                                var serverId = res.serverId; // 返回图片的服务器端ID
                                $('.img-'+img_id).data('id',serverId);
                                img_id ++;
                                serverArr.push(serverId);
//                                alert(serverArr);
//                                $('#serverId').prepend('<input type="hidden" id="serverId" value="'+ serverId +'" class="serverId">');
                                //$('.serverId').val(serverId);
                            }
                        });
                    }
                });
            });
        }
    })
    /*$('.img').click(function () {
        $('.file').click();
    });*/

    //图片上传
    /*$(".file").fileupload({
        url:"/Base/Common/upload",//文件上传地址，当然也可以直接写在input的data-url属性内
//        beforeSend:function(){
//            $('.load').show();
//        },
        done:function(e,result){
            //done方法就是上传完毕的回调函数，其他回调函数可以自行查看api
            //注意result要和jquery的ajax的data参数区分，这个对象包含了整个请求信息
            //返回的数据在result.result中，假设我们服务器返回了一个json对象
            var data=$.parseJSON(result.result);
            if(data.status=='S'){
                var html = '<img src="'+data.url+'">';
                $('#repair_image .img').html(html);
            }else{
                $.alert('error',data.message);
                return false;
            }
        }
    });*/

    //提交数据
    $('#patrol_submit').click(function(){

        var arr=[];
        $('.img_add').each(function(){
            arr.push(this.src);
        });
        var img = arr.join('@');

        if (!img){
            fm.alert('请上传报修图片！');
            return false;
        }
        var content = $('#content').val();
        if (!content){
            fm.alert('请描述报修内容！');
            return false;
        }
        //var serverId = $('#serverId').val();
       /* var serverArr=[];
        $('.img_add').each(function(){
            serverArr.push(this.data('id'));
        });
        var serverId = serverArr.join('@');*/
        var serverid = serverArr.join('@');
        $.ajax({
            type:'post',
            url:"/Repaireast/RepaireastWorker/doPatrolRepair",
            dataType:'json',
            data:{
                'image' : img,
                'content' : content,
                'patrol_id' : "{BEESCRM:$patrol_id}",
                'serverId':serverid
            },
            success:function(data){
                fm.alert('操作成功!');
                setTimeout(function(){
                    window.location.href='/Repaireast/Repaireast/index';
                },2000);
            },
            error:function(){
                fm.alert('通讯失败，请稍后再试');
            }
        });
    });

    // 图片上传
//    var imgLength = 0;
//    $(document).on('change','#upload', function () {
//        var fd = new FormData($('#upload-form')[0]);
//        fd.append('file', $('#upload')[0].files[0]);
//        console.log(fd);
//
//        if(imgLength >= 5) {
//            fm.alert('图片太多了呦~');
//            return false;
//        }
//        $('#upload').val('');
//        $.ajax({
//            url: '/base/common/upload',
//            data: fd,
//            processData: false,
//            contentType: false,
//            type:'POST',
//            beforeSend: function () {
//                fm.alert("上传中...");
//            },
//            success: function (res) {
//                //$('.loading-wrap').hide();
//                var imgResult = $.parseJSON(res);
//                if(imgResult.status == 'S') {
//                    //topicObj.image_list.push(imgResult.url);
//                    $('.thumb-preview').prepend('<div class="pull-left thumb img"><img class="img_add" src="'+ imgResult.url +'"></div>');
//
//                    imgLength += 1;
//                    var img = $('#img').val();
//                    if(img){
//                        img += '@' + imgResult.url;
//                    }else {
//                        img = imgResult.url;
//                    }
//                    $('#img').val(img);
//                }else{
//                    fm.alert('图片上传错误，请重试');
//                }
//            }/*,
//             error:function(){
//             fm.alert('通讯错误');
//             },*/
//        });
//    });
    //图片删除
    $(".thumb-preview").on('click','.thumb',function () {

        $('.pop-box').removeClass('hide');
        var $this = $(this);
        var this_id = $(this).data('id');
        $('.pop-box').on('click','.yes',function () {
            $('.pop-box').addClass('hide');
            $this.remove();
            for(var i=0;i<serverArr.length;i++) {
                if (serverArr[i] == this_id) {
                    serverArr.splice(i, 1);
                }
            }
            imgLength -= 1;
        });
    })
    $('.pop-box').on('click','.no ,.icon-cheng1',function () {
        $('.pop-box').addClass('hide');
    })

</script>
<include file="../footer" />